<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns:a="https://github.com/pylonide/pylon" xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <script src="../ppc.js"></script>
    </head>
    <body>
        <a:skin src="../skins.xml" media-path="../images/" icon-path="../icons/" />
        
        <a:appsettings debug="1" />
        
        <a:model id="mdlPictures"> 
            <pictures> 
                <picture title="Landscape" src="img1.jpg" /> 
                <picture title="Animal" src="img2.jpg" /> 
                <picture title="River" src="img1.jpg" /> 
            </pictures> 
        </a:model> 
        <a:list 
          id = "lstPics" 
          skin = "thumbnail" 
          height = "200" 
          width = "400" 
          model = "mdlPictures"> 
            <a:each match = "[picture]" > 
                <a:name match="[@title]" /> 
                <a:image match="[@src]" /> 
            </a:each> 
        </a:list> 
        
        <a:list 
          id     = "lstPics" 
          skin   = "thumbnail" 
          height = "200" 
          width  = "400" 
          model  = "mdlPictures"
          each   = "[picture]"
          name   = "[@title]"
          image  = "[@src]" /> 
        <a:img 
          model = "{lstPics.selected}" 
          value = "[@src]" 
          width = "200" 
          height = "200" />
    </body>
</html>